<template>
  <div class="settle_page">
    <el-form :inline="true" size="small" class="el_form">
      <el-form-item label="城市：">{{ city }}</el-form-item>
      <el-form-item label="门诊：">{{ hospital }}</el-form-item>
      <el-form-item label="时间：">{{ time }}</el-form-item>
      <el-form-item label="结算责任人：">
        <user-select v-model="formInline.principals" :multiple="false"></user-select>
      </el-form-item>
      <el-form-item label="关键词：">
        <el-input v-model="formInline.term" placeholder="请输入姓名或电话"></el-input>
      </el-form-item>
      <el-form-item label="">
        <el-button type="primary" @click="getList()">搜索</el-button>
      </el-form-item>
    </el-form>

    <el-table class="el_table" size="small" :data="list" border>
      <el-table-column label="客户姓名" prop="name" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="客户电话" prop="phone" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="预约时间" prop="appointmentTime" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="总成交金额" prop="totalDealAmount" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="总收款金额" prop="totalCollectMoney" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="已结算金额" prop="totalSettleAmount" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="门诊反馈" prop="outpatientFeedback" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="成交金额" prop="dealAmount" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="收款金额" prop="collectMoney" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="反馈时间" prop="feedbackTime" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="主诉项目" prop="mainProject" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="全科项目" prop="generalProject" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="结算规则" prop="settleRule" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="本期结算" prop="settleCurrent" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="缴费类型" prop="dealType" :width="tdWdith" show-overflow-tooltip>
        <template slot-scope="{row}">{{ DEALTYPE[row.dealType] }}</template>
      </el-table-column>
      <el-table-column label="备注" prop="remark" :width="tdWdith" show-overflow-tooltip />
      <el-table-column label="是否计入结算" prop="" :width="120" show-overflow-tooltip>
        <template slot-scope="{row}">
          <el-switch v-model="row.reckonInSettled" :active-value="1" :inactive-value="2" @change="getSumary"></el-switch>
        </template>
      </el-table-column>
      <el-table-column label="操作" prop="" show-overflow-tooltip fixed="right" align="center" :width="tdWdith">
        <template slot-scope="{row}">
          <el-link type="primary" class="el_link" @click="openEdit(row)" v-if="info.settleStatus != 1">修订</el-link>
          <el-link type="danger" class="el_link" @click="removeSettle(row)" v-if="info.settleStatus != 1">移除</el-link>
        </template>
      </el-table-column>
      <div slot="append" class="table_summary_column" v-if="list && list.length > 0">
        <span class="cbold">合计：</span>
        <span>成交金额：{{ summary.dealAmount }}</span>
        <span>收款金额：{{ summary.collectMoney }}</span>
        <span>结算金额：{{ summary.settleAmount }}</span>
      </div>
    </el-table>

  </div>
</template>
<script>
import {
  broadcast,
  deepClone,
  showToast,
  showModal,
  downPackFile,
  received,
} from "@/common/util";
import {
  BASEURL,
  GET_SETTLEMENTDETAILS_LIST,
  GET_SETTLEMENTDETAILS_OUTPUTANDSAVE,
  GET_ORGANIZATION_FULLORGTREE
} from "@/http/finance";
import { DEALTYPE } from "@/common/constants";
import moment from "moment";
export default {
  name: "SettleMent",
  props: {
    info: {
      type: Object,
      default: () => {
        return {};
      },
    },
    source: {
      type: String,
      default: "details",
    },
  },
  data() {
    return {
      formInline: {},
      tdWdith: 140,
      list: [],
      summary: {},
      DEALTYPE,
      city: "",
      hospital: "",
      time: "",
    };
  },
  created() {
    let _info = this.info;
    let _state = this.$store.state;
    let cityList = _state.cityList;
    let hospitalList = _state.hospitalList;

    let o = cityList.find((k) => k.code == _info.city);
    let n = hospitalList.find((k) => k.id == _info.hospital);
    this.city = o ? o.name : "";
    this.hospital = n ? n.name : "";
    //this.time = moment().format("yyyy-MM-DD HH:mm:ss");
    this.time = _info.outputTime;

    this.getList();

    let _this = this;
    received("customer.add.success", function () {
      _this.getList();
    });
    this.getUsers()
  },
  mounted() {
    //this.$set(this.formInline, "principals", this.info.principals);
    
  },
  methods: {
    // 获取参数
    getParams() {
      let info = deepClone(this.info);
      console.log(info);
      let oParams = { ...info };
      if (info.type == "details") {
        oParams.city = info.city;
        oParams.hospital = info.hospital;
        oParams.settleStatus = info.settleStatus;
        oParams.principals = info.principals;
      }
      if (info.id) {
        oParams.outputId = info.id;
      }
      oParams.term = this.formInline.term;
      delete oParams.type;
      delete oParams.outputTime
      return oParams;
    },

    // 获取列表
    async getList() {
      let oParams = this.getParams();

      let res = await GET_SETTLEMENTDETAILS_LIST(oParams);
      console.log(res);
      let list = res.data || [];
      list.map((k) => {
        k.reckonInSettled = k.reckonInSettled || 1;
        return k;
      });
      this.list = list;
      //this.summary = res.summary || {};
      this.getSumary();
    },

    // 获取导出参数
    getExportParams() {
      let _this = this;
      let info = this.info;
      let list = this.list;
      let arr = [];
      let oParams = {};

      list.map((k) => {
        let o = {};
        o.settleStatus = k.reckonInSettled;
        o.settlementId = k.id;
        arr.push(o);
      });
      if (info.id) {
        oParams.outputId = info.id;
      }
      oParams.city = info.city;
      oParams.cityName = _this.city;
      oParams.hospitalId = info.hospital;
      oParams.principalId = this.formInline.principals;
      oParams.list = arr;
      return oParams;
    },

    // 保存数据
    async saveInfo() {
      let _this = this;
      let oParams = _this.getExportParams();

      if (!oParams.principalId) {
        showToast({
          message: "请选择结算责任人",
        });
        _this.$emit("change");
        return false;
      }

      // if (this.summary.settleAmount <= 0) {
      //   showToast({
      //     message: "结算金额必须大于0",
      //   });
      //   _this.$emit("change");
      //   return false;
      // }
      GET_SETTLEMENTDETAILS_OUTPUTANDSAVE(oParams).then(res => {
          if(res.code == 200){
            _this.$emit("change", { id: "settleDialog" });
          }
      })
      // let res = await GET_SETTLEMENTDETAILS_OUTPUTANDSAVE(oParams);
      // _this.$emit("change", { id: "settleDialog" });
      // if (res.code == 200) {
      //   let options = {};
      //   options.url = BASEURL + res.data;
      //   options.name = "";
      //   if (_this.info.type == "details") {
      //     downPackFile(options);
      //   }
      //   //window.open(BASEURL + res.data);
      // }
    },

    // 打开修订
    openEdit(row) {
      let options = deepClone(row);
      options.type = 3;
      broadcast("appoint.dialog.open", options);
    },

    // 删除结算
    removeSettle(row) {
      let _this = this;
      showModal({
        message: "确定移除该条数据吗？",
        showCancelButton: true,
        success: function () {
          let list = _this.list;
          _this.list = list.filter((k) => k.id != row.id);
          _this.getSumary();
          // let oParams = {};
          // oParams.id = row.id;
          // DELETE_BILLINGRECORDS_DETAIL(oParams).then((res) => {
          //   if (res.code == 200) {
          //     showToast({
          //       message: "移除成功",
          //       type: "success",
          //     });
          //     _this.getList();
          //   }
          // });
        },
      });
    },

    // 计算总额
    getSumary() {
      let list = this.list;
      let dealAmount = 0;
      let collectMoney = 0;
      let settleAmount = 0;
      let o = {};
      list.map((k) => {
        if (k.reckonInSettled == 1) {
          dealAmount += Number(k.dealAmount);
          collectMoney += Number(k.collectMoney);
          settleAmount += Number(k.settleCurrent);
        }
      });

      o.dealAmount = dealAmount;
      o.collectMoney = collectMoney;
      o.settleAmount = settleAmount;
      this.summary = o;
    },

    // 获取责任人
    getUsers(){
      GET_ORGANIZATION_FULLORGTREE().then(res => {

      })
    }

  },
};
</script>
<style lang="scss" scoped>
.el_form {
  display: flex;

  .el-form-item {
    margin: 0 16px 10px 0;
  }

  .el-form-item:last-child {
    margin: 0 0 10px 0;
  }
}

.table_summary_column {
  padding: 12px 15px;

  span {
    margin: 0 40px 0 0;
    font-size: 14px;
  }

  .cbold {
    font-weight: bold;
    margin-right: 10px;
  }
}
</style>